import MessageUtil from "@/utils/model/MessageUtil";
import { highlight } from "@/global/BeanFactory";
import useLoadingStore from "@/store/LoadingStore";
import { BrowserWindowType, createDataBrowserWindow } from "@/plugins/native/browser-window";
import Constant from "@/global/Constant";
import { formatJsonString } from "$/util";
import { DialogInstance, DialogPlugin, TNode } from "tdesign-vue-next";
import MonacoView from "@/components/view/MonacoView/index.vue";
import { useUrlStore } from "@/store";
import { clientInstanceGetStateApi } from "@/api";

/**
 * 对话框参数
 */
interface DialogOption {
  width: string;
}

/**
 * 显示json对话框，异步加载数据
 * @param title 对话框标题
 * @param data 数据
 * @param options 操作人
 */
export function showJsonDialogByAsync(
  title: string,
  data: Promise<string>,
  options?: DialogOption
) {
  useLoadingStore().start("开始获取数据，请稍后");
  data
    .then((json) => showJson(title, json, options))
    .catch((e) => MessageUtil.error("数据获取失败", e))
    .finally(() => useLoadingStore().close());
}

/**
 * 显示实例信息对话框
 * @param title 对话框标题
 * @param url 数据地址
 * @param options 操作人
 */
export function showInstanceInfoDialog(title: string, url: string, options?: DialogOption) {
  useLoadingStore().start("开始获取数据，请稍后");
  const { id } = useUrlStore();
  if (!id) {
    MessageUtil.error("请选择一个实例");
    return;
  }
  clientInstanceGetStateApi(id, url)
    .then((json) => showJson(title, json, options))
    .catch((e) => MessageUtil.error("数据获取失败", e))
    .finally(() => useLoadingStore().close());
}

export function jsonToHtml(json: string | any): { html: string; original: string } {
  // 原始值
  let value: string;
  // 格式化后的值
  let html: string;
  let needPretty = true;
  if (typeof json === "string") {
    if (/^\s*(\{[\s\S]*}|\[[\s\S]*])\s*$/.test(json)) {
      try {
        value = formatJsonString(json);
      } catch (e) {
        MessageUtil.error("格式化JSON失败", e);
        value = json as string;
        needPretty = false;
      }
    } else {
      value = json as string;
      needPretty = false;
    }
  } else {
    value = JSON.stringify(json, null, 4);
  }
  // 原始值
  if (needPretty && value !== "") {
    const highlightResult = highlight.highlight(value, {
      language: "json"
    });
    html = highlightResult.value;
  } else {
    html = value;
  }
  return { html, original: value };
}

export function showJson(title: string, json: string, options?: DialogOption) {
  // 原始值
  const value = formatJsonString(json);
  // 创建对话框
  if (Constant.isSupportPin) {
    showDialog(title, () => <MonacoView value={value} height={"calc(100vh - 220px)"} />, options);
  } else {
    createDataBrowserWindow(BrowserWindowType.JSON, value, value, {
      title: title
    });
  }
}

/**
 * 显示一个对话框
 * @param header 对话框标题
 * @param content 对话框内容
 * @param options 对话框选项
 */
export function showDialog(header: string, content: TNode, options?: DialogOption): DialogInstance {
  // 创建对话框
  return DialogPlugin({
    header: header,
    default: content,
    draggable: true,
    width: options ? options.width : "80vw",
    footer: false,
    className: "es-dialog",
    placement: "center"
  });
}
